doctype html
head
    meta(charset='utf-8')
    title Mongoose
    link(href="/static/app.css" rel="stylesheet")
body
    nav.topnav
        ul.topnav-left
            li
                a Mongoose-Demo
        ul.topnav-right
            li
                button#open-register Register
                span#user-name
    div#content
        div.toolbar.clearfix
            div.form-group
                label(for="article-id") ID:
                input(type="text" id="article-id")
            div.form-group
                button#search Search
        table(cellpadding="0" cellspacing="0")
            thead
                tr
                    th ID
                    th Title
                    th Content
                    th Author
                    th Date
                    th Handle
            tbody
        div.toolbar.clearfix
            div.form-group
                label(for="articleid") ID:
                    input(type="text" id="articleid")
            div.form-group
                button#search2 Search Author
            div.form-group
                button#search3 Get Address
        div.author-detail
        div.article-content
            div
                h4 Add
                div.article-box
                    div.form-group
                        label(for="title") Title
                        input(type="text" id="title")
                    div.form-group
                        label(for="con") Content
                        textarea(id="con")
                    div.form-group
                        button#save Save
            div
                h4 Update
                div.article-box
                    div.form-group
                        label(for="u-id") ID
                        input(type="text" id="u-id")
                    div.form-group
                        label(for="u-title") Title
                        input(type="text" id="u-title")
                    div.form-group
                        label(for="u-con") Content
                        textarea(id="u-con")
                    div.form-group
                        button#update Update
                div.result
    div.city-content
        table#city-table
        div.city-search
            div.city-search-result
                h4 结果
                div#city-result
            button#citySearch1 查询总人口大于1000的省份
            button#citySearch2 查询总IT人口大于400的省份且返回所有城市名称
            button#citySearch3 以城市总人口排序，且值返回城市/省份/人数三个字段
            button#citySearch4 从第二条数据开始，返回一条数据
            button#citySearch5 随机返回一条数据
            button#citySearch6 查询张三发表的文章
    div#register
        div.overlay
        div.register-box
            div.form-group
                label(for="u-name") Name
                input(type="text" id="u-name" placeholder="Required, minlength: 3, maxlength: 6")
                div.error(data-error="name")
            div.form-group
                label(for="u-phone") Phone
                input(type="text" id="u-phone" placeholder="Required, (13... | 15... | 18...)")
                div.error(data-error="phone")
            div.form-group
                label(for="u-age") Age
                input(id="u-age" placeholder="Required, min: 18, max: 30")
                div.error(data-error="age")
            div.form-group
                label(for="u-sex") Sex
                select#u-sex
                    option(value="Don't know") Don't know
                    option(value="male") male
                    option(value="female") female
                div.error(data-error="sex")
            div.form-group
                button#register-btn Register
    script(src="/static/app.js")